<template>
    <div class="main">
        <h3>个人设置</h3>
        <el-form :model="formInline" class="demo-form-inline">
            <el-form-item label="手机号">
                <el-input v-model="formInline.phone" placeholder="手机号"></el-input>
            </el-form-item>
            <el-form-item label="密码">
                <el-input v-model="formInline.user" show-password placeholder="密码"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="onSubmit">保存</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>
<script>
    import $ from "jquery";

    export default {
        data(){
            return {
                formInline: {
                    phone: '',
                    password: ''
                }
            }
        },
        mounted(){
            // 加载用户信息 user/userInfo
            this.loading(true)
            $.post("/user/userInfo",Response => {
                if(Response.success){
                    // this.options = Response.data;
                    this.loading(false)
                // console.log(formInline)
                    this.formInline = (Response.data || [])
                    // this.$message.success('保存成功');
                }else{
                    this.$message.error(Response.errMessage);
                }
                // console.log(Response)
            })
        },
        methods:{
            onSubmit(){
                // 修改用户信息
                this.loading(true)
                $.post("/user/editSave",{"info":JSON.stringify(this.formInline)},Response => {
                    if(Response.success){
                        // this.options = Response.data;
                        this.loading(false)
                        // console.log(formInline)
                        this.formInline = (Response.data || [])
                        // this.$message.success('保存成功');
                    }else{
                        this.$message.error(Response.errMessage);
                    }
                    // console.log(Response)
                })

            },
            loading(bool = true) {

                const loading = this.$loading({
                    lock: true,
                    text: '',
                    spinner: 'el-icon-loading',
                    background: 'rgba(255, 255, 255, 0.7)'
                });
                if(!bool){
                    loading.close();
                }
            }
        }
    }
</script>

<style>
.main{
    padding:20px;
}
</style>